<div ng-mouseenter="pause()" ng-mouseleave="play()" class="carousel" ng-swipe-right="prev()" ng-swipe-left="next()">
    <div class="carousel-inner" ng-transclude></div>
    <!--<a role="button" href class="left carousel-control" ng-click="prev()" ng-show="slides.length > 1">-->
    <!--<span aria-hidden="true" class="glyphicon glyphicon-chevron-left"></span><span-->
    <!--class="sr-only">previous</span></a><a role="button" href class="right carousel-control"-->
    <!--ng-click="next()" ng-show="slides.length > 1">-->
    <!--<span aria-hidden="true" class="glyphicon glyphicon-chevron-right"></span><span-->
    <!--class="sr-only">next</span> </a>-->
    <ol class="carousel-indicators" ng-show="slides.length> 1" style="text-align: right">
        <li ng-repeat="slide in slides | orderBy:indexOfSlide track by $index"
            ng-class="{ active: isActive(slide) }" ng-click="select(slide)" style="margin-left: 30px"> <span
            class="sr-only">slide {{ $index  + 1 }} of {{ slides.length }}<span
            ng-if="isActive(slide)">, currently active</span></span>
        </li>
    </ol>
</div>
